.container {
    margin: 60px;
    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(200px, 1fr));
    grid-gap:5px;
    grid-auto-flow: row dense;
    grid-auto-rows: 50px;
    grid-template-rows: 200px 300px;
    justify-content: center;
    grid-auto-rows: 50px;
    grid-auto-columns: 50px;
    
}
.one {
    background: red;
}
.two {
    background: green;
}
.three {
    /* display: grid; */
    background: yellow;
    grid-column-start: span 3;
}
.four {
    background: blue;
}
.five {
    background: salmon;
}
.six {
    background: yellowgreen;
}
.seven {
    background: chocolate;
}

.eight {
    background: sienna;
}

.night {
    background: navy;
}


.container > div {
    font-size: 200%;
    text-align: center;
    color: #fff;
}


